<!DOCTYPE html>
<html lang="en">
<head>
	<title>预定房间</title>
	<meta charset="UTF-8" http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" type="text/css" href="<{$ipath}>minisite/hotel/style/orderRoom.css">
    <link rel="stylesheet" type="text/css" href="<{$ipath}>minisite/hotel/style/orderRoom1.css">
    <link rel="stylesheet" type="text/css" href="<{$ipath}>minisite/hotel/style/jquery-ui.css">
    <link href="<{$ipath}>public/style/alert_css.css" type="text/css" rel="stylesheet">
    <script type="text/javascript" src="<{$ipath}>minisite/hotel/js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="<{$ipath}>minisite/hotel/js/jquery-ui-datepicker.js"></script>
    <script type="text/javascript">
     var myDate = new Date();
     var myYear = myDate.getFullYear();
     var myMonth = myDate.getMonth()+1;
     var myDay = myDate.getDate();
     var currentDate = myYear+'-'+myMonth+'-'+myDay;
     var curr1 = new Date(myYear,myMonth,myDay).getTime();//比较日期
    
   
    	$(function(){
          if($('#date_1').val()!='请选择' && $('#date_2').val()!='请选择' ){
            var comes = $('#date_1').val().split('-');
            var leavs = $('#date_2').val().split('-');
            var come = new Date(comes[0],comes[1],comes[2]).getTime();
            var lea = new Date(leavs[0],leavs[1],leavs[2]).getTime();
            var wan = (lea-come)/3600000/24;
             $('li.inDays span.daysNumber').text(wan);
            /*var yC = comes[0];
            var mC = comes[1];
            var dC = comes[2];
            var yL = leavs[0];
            var mL = leavs[1];
            var dL = leavs[2];*/
           
          }
            //window.location.reload();
         /*钱数只能显示到9999.99.超出不显示*/
         $('.moneyNum').each(function(index, el) {
             //alert($(this).text().substring(0,1));
            if($(this).text().length>7){
                var subStr = $(this).text().substring(0,7);
                $(this).text(subStr);
             }

         });
        
		/*房间标准*/
    		var igroup = $('.roomPrice i');
    		var subs = $('.subRoom');
    		igroup.each(function(index, el) {
    			$(this).toggle(function() {
    				subs.eq(index).slideDown();
                    window.scrollBy(0,150);
                    $(this).css({
                        background: 'url(<{$ipath}>minisite/hotel/images/up-arrow.png) no-repeat',
                        width: '18px',
                        height:'18px',
                        backgroundSize: '100%',
                        right: '0%'
                    });
    			}, function() {
    				subs.eq(index).slideUp();
                    $(this).css({
                        background: 'url(<{$ipath}>minisite/hotel/images/down-arrow.png) no-repeat',
                        width: '18px',
                        height:'18px',
                        backgroundSize: '100%',
                        right: '0%'
                    });
    			});
    			
    		});
    		/*日历*/
    		var a ='' ;
    		var b = '';
    		var aYear = '';
    		var aMonth = '';
    		var aDay = '';
    		var bYear = '';
    		var bMonth='';
    		var bDay = '';
    		var dayNum = '';
    		$("#alternate1,#date_1").datepicker({
                //$('.shade').show();
				dateFormat: 'yy年mm月dd日',
				altField: "#alternate1",
				altFormat: "DD",
				onSelect:function(dateText,inst){ 
                   // $('.shade').hide()
                	a = dateText;
                	aYear = a.split('年')[0];
                	aMonth = a.split('月')[0].split('年')[1];
                	aDay = a.split('月')[1].split('日')[0];
                	var k = aYear+'-'+aMonth +'-'+aDay;
                    var k1 = new Date(aYear,aMonth,aDay).getTime();
                    if(k1<curr1){
                        //alert('您不能选择到今天之前的日期哦');
                        /*$('#alert_p').html('您不能选择到今天之前的日期哦');
                        $('#alert_box').show();*/
                        alert_show('您不能选择到今天之前的日期哦');
                        $('#date_1').val('请选择');
                        $('#alternate1').val('入住时间');
                        return;
                    }
                	$('#btim').val(k);
                
                	$("#date_1").val(aYear+'-'+aMonth +'-'+aDay);
                	$('#aMonth').val(aMonth);
                    $('#aDay').val(aDay);
                    $('#aYear').val(aYear);

                    if($('#date_1').val()!='请选择' && $('#date_2').val()!='请选择' )
                    {
                        var comeMonth = $('#aMonth').val();
                        var leaveMonth = $('#bMonth').val();
                        var comeDay = $('#aDay').val();
                        var leaveDay = $('#bDay').val();
                        var comeYear = $('#aYear').val();
                        var leaveYear = $('#bYear').val();
                        //alert($('#bYear').val());
                        if(comeYear==leaveYear){
                            if(leaveMonth>comeMonth){
                                if(leaveDay>comeDay)
                                {
                                    dayNum = 30*(leaveMonth-comeMonth)+(leaveDay-comeDay)
                                    if(dayNum>30){
                                        //alert('最多预定30天');
                                        alert_show('最多预定30天');
                                        $('#date_1').val('请选择');
                                        $('#alternate1').val('入住时间');
                                        $('li.inDays span.daysNumber').text('0');
                                    }
                                }
                                else{
                                        dayNum = 30*(leaveMonth-comeMonth)-(comeDay - leaveDay)
                                        if(dayNum>30){
                                            //alert('最多预定30天');
                                            alert_show('最多预定30天');
                                            $('#date_1').val('请选择');
                                            $('#alternate1').val('入住时间');
                                            $('li.inDays span.daysNumber').text('0');
                                        }
                                    }
                         
                            }else if(leaveMonth==comeMonth){
                                if(leaveDay>=comeDay)
                                    {
                                        dayNum = leaveDay-comeDay
                                    }
                                else{
                                       
                                        //alert('您输入时间有误！请重新输入');
                                        alert_show('您输入时间有误！请重新输入');
                                        $('#date_1').val('请选择');
                                        $('#alternate1').val('入住时间');
                                        dayNum = 0;
                                 }
                                

                            }else if(leaveMonth<comeMonth){
                                        //alert('您输入的时间有误！请重新输入');
                                        alert_show('您输入时间有误！请重新输入');
                                        $('#date_1').val('请选择');
                                        $('#alternate1').val('入住时间');
                                        
                        }
                          $('li.inDays span.daysNumber').text(dayNum);   
                        }else if(comeYear<leaveYear){
                            var c = new Date(comeYear,comeMonth,comeDay).getTime();
                            var l = new Date(leaveYear,leaveMonth,leaveDay).getTime();
                            var curdayNum = (l-c)/3600000/24;
                            if(curdayNum>30){
                                //alert('最多预定30天');
                                alert_show('最多预定30天');
                                $('#date_1').val('请选择');
                                $('#alternate1').val('离开时间');
                                $('li.inDays span.daysNumber').text('0');
                            }else{
                                $('li.inDays span.daysNumber').text(curdayNum);
                            }
                        }
                    }

        		} 
	});			
    		$("#date_2,#alternate2").datepicker({
				dateFormat: 'yy年mm月dd日',
				altField: "#alternate2",
				altFormat: "DD",
				onSelect:function(dateText,inst){ 
                    b = dateText;
                    bYear = b.split('年')[0];
                    bMonth = b.split('月')[0].split('年')[1];
                    bDay = b.split('月')[1].split('日')[0];
                    var o = bYear+'-'+bMonth+'-'+bDay;
                    var o1 = new Date(bYear,bMonth,bDay).getTime();
                    if(o1<curr1){
                        //alert('不能输入今天之前的日期');
                        alert_show('不能输入今天之前的日期');
                        $('#date_2').val('请选择');
                        $('#alternate2').val('离开时间');
                        return;
                    }
                    $('#etim').val(o);
                   /* ltim = $('#etim').val();*/
                    $("#date_2").val(bYear+'-'+bMonth+'-'+bDay);
                    $('#bMonth').val(bMonth);
                    $('#bDay').val(bDay);
                    $('#bYear').val(bYear);
                    //alert($('#bMonth').val());
                    
                    if($('#date_1').val()!='请选择' && $('#date_2').val()!='请选择' )
                    {
                   
                   
                        var comeMonth = $('#aMonth').val();
                        var leaveMonth = $('#bMonth').val();
                        var comeDay = $('#aDay').val();
                        var leaveDay = $('#bDay').val();
                        var leaveYear = $('#bYear').val();
                        var comeYear = $('#aYear').val();
                        if(comeYear==leaveYear){
                            if(leaveMonth>comeMonth){
                                //alert(1);
                                if(leaveDay>comeDay)
                                    {
                                        dayNum = 30*(leaveMonth-comeMonth)+(leaveDay-comeDay);
                                        if(dayNum>30){
                                            //alert('最多预定30天');
                                            alert_show('最多预定30天');
                                            $('#date_2').val('请选择');
                                            $('#alternate2').val('入住时间');
                                            $('li.inDays span.daysNumber').text('0');
                                        }
                                    }
                                    else{
                                        dayNum = 30*(leaveMonth-comeMonth)-(comeDay - leaveDay);
                                        if(dayNum>30){
                                            //alert('最多预定30天');
                                            alert_show('最多预定30天');
                                            $('#date_2').val('请选择');
                                            $('#alternate2').val('入住时间');
                                            $('li.inDays span.daysNumber').text('0');
                                        }
                                    }
                         
                          }else if(leaveMonth==comeMonth){
                                if(leaveDay>=comeDay){dayNum = leaveDay-comeDay}
                                    else{ 
                                        //alert('您输入的时间有误！请重新输入');
                                        alert_show('您输入的时间有误！请重新输入');
                                        $('#date_2').val('请选择');
                                        $('#alternate2').val('离开时间');
                                        dayNum = 0;
                                    }
                                

                          }else if(leaveMonth<comeMonth){
                            //alert('您输入的时间有误！请重新输入');
                            alert_show('您输入的时间有误！请重新输入');
                            $('#date_2').val('请选择');
                            $('#alternate2').val('离开时间');
                            dayNum = 0;
                        }
                          $('li.inDays span.daysNumber').text(dayNum);
                        }else if(comeYear<leaveYear){
                               var c = new Date(comeYear,comeMonth,comeDay).getTime();
                               var l = new Date(leaveYear,leaveMonth,leaveDay).getTime();
                               var nums = (l-c)/3600000/24;
                               //alert(nums);
                               if(nums>30){
                                //alert('最多预定30天');
                               alert_show('最多预定30天');
                                $('#date_2').val('请选择');
                                $('#alternate2').val('离开时间');
                                $('li.inDays span.daysNumber').text('0');
                               }else{ $('li.inDays span.daysNumber').text(nums);}
                        }
                    }
        		}
	});

             

        /*预约btn*/
    	$('.preOrder').each(function(index, el) {
    		$(this).click(function(event) {

              //alert($('#date_1').val());
                if($('#date_1').val()=='请选择' || $('#date_2').val()=='请选择' ){
                    //alert('请先输入时间');
                    $('#alert_p').html('请先输入时间');
                    $('#alert_box').show();
                    window.scrollTo(0,0);
                    return false;
                }
    			 var hid = $('#hid').val();
    			 var fid = $(this).parent('a').parent('li').attr('data-type');
    		     var rid = $(this).parents('.subRoom').prev('.baseRoomContainer').attr('data-rid');
    		     var btim = $('#btim').val();
    		     var etim = $('#etim').val();
				 var paytype=$(this).attr("data-pay"); 
				 
    		    $(this).parent('a').attr('href','?a=order&hid='+hid+'&rid='+rid+'&fid='+fid+'&btim='+btim+'&etim='+etim+'&paytype='+paytype);
    		});
    	});
    	/*房型推荐btn*/
    	$('.roomTypeChoose').click(function(event) {
    		$('.shade').show();
    		$('.roomTypeContaner').slideDown('slow');
    	});
    	/*房型选中效果*/
    	$('.roomType .spanPublic').toggle(function() {
    		$(this).addClass('cur');
    	}, function() {
    		$(this).removeClass('cur');
    	});
        $('.food .spanPublic').click(function(event) {
            $(this).addClass('cur').parent().siblings().find('span').removeClass('cur');
        });
    	/*房型推荐清空btn*/
    	$('.roomBtn #empty').click(function(event) {
    		$('.roomType span').removeClass('cur');
    	});
    	/*房型推荐确定btn*/
    	$('.roomBtn #confirm').click(function(event) {

    		var roomTypes = $('.room span.cur');
    		var isFood = $('.food span.cur');
    	    var rooms = $('.room span.cur').length;
            var foods = $('.food span.cur').length;
           // alert(roomTypes.eq(2).attr('data-tid'));
            if(rooms>0 && foods>0){
                var strs='';
                for (var i = 0; i < roomTypes.length; i++) 
                {
                strs+=roomTypes.eq(i).attr('data-tid')+',';
                };
                hrefAddress = '?a=booking&hid=<{$hid}>&tids='+strs+'&isfood='+isFood.attr('data-food');
            }else if(rooms==0 && foods>0)
            {
                hrefAddress = '?a=booking&hid=<{$hid}>&isfood='+isFood.attr('data-food');
            }else if(foods==0 && rooms>0)
            {
                 var strs='';
                 for (var i = 0; i < roomTypes.length; i++) 
                 {
                 strs+=roomTypes.eq(i).attr('data-tid')+',';
                 };
                 hrefAddress = '?a=booking&hid=<{$hid}>&tids='+strs;
            }else if(foods==0 && rooms==0)
            {
                 hrefAddress = '?a=booking&hid=<{$hid}>';
            }
    		
            /*alert(hrefAddress);*/
    		$(this).parent(a).attr('href', hrefAddress);

    		$('.roomTypeContaner').slideUp();
    		$('.shade').hide();
    	});
    	/*推荐排序btn*/
    	$('.sortRec').click(function(event) {
    		$('.shade').show();
    		$('.sortRecomendContaner').slideDown();
    	});
    	/*推荐排序条目选择后效果*/
    	$('.sortRecomendContaner ul li a').click(function(event) {
    		/*$(this).addClass('ort').siblings('li').removeClass('ort');*/
            $(this).css({
                color: '#18d5d7',
                background: 'url(<{$ipath}>minisite/hotel/images/dh.png) no-repeat 90% center',
                backgroundSize:'5%',
            }).parent('li').siblings('li').find('a').css({
                color: '#292929',
                background: 'none'
            });
    		$('.sortRecomendContaner').slideUp();
    		$('.shade').hide();
    	});
    	/*点击遮罩层，浮层消失*/
    	$('.shade').click(function(event) {
    		if($('.roomTypeContaner').is(':visible')){
    			$('.roomTypeContaner').hide();
    			$(this).hide();
    		}
    		if($('.sortRecomendContaner').is(':visible')){
    			$('.sortRecomendContaner').hide();
    			$(this).hide();
    		}
    	});
       /*$('body').bind('touchmove', function(event) {
          $('.foot').fadeOut('slow');

       });
        $('body').bind('touchend', function(event) {
         
           setTimeout(function(){  $('.foot').fadeIn('slow'); },2000);
       });*/

 })
     function alert_quxiao(){
        $('#alert_box').hide();
    }
    function alert_show(str){
        $("#alert_p").html(str);
        $("#alert_box").show();
        }

     
    </script>
</head>
<body>
    <input type="hidden" id="btim" value="0" >
    <input type="hidden" id="etim" value="0">
    <input type="hidden" id="bMonth" value="0" >
    <input type="hidden" id="aMonth" value="0">
    <input type="hidden" id="aYear" value="0">
    <input type="hidden" id="bYear" value="0">
    <input type="hidden" id="bDay" value="0" >
    <input type="hidden" id="aDay" value="0">
    <input type="hidden" id="hid" value="<{$hid}>">
	
    <!--alert弹出框-->
    <div class="alert_box" id="alert_box">
        <div class="alert_content">
            <P class="alert_p" id="alert_p">我是弹出内容</P>
            <div class="alert_div">
                <p class="quxiao" onClick="alert_quxiao();">确定</p>
            </div>
        </div>
    </div>
<!--alert弹出框-->

    <header>
		
		<h1 id="yytitl">
			预约订房
			<i onclick="window.history.go(-1)"></i>
		</h1>
		<div class="daysContainer">
			<ul class="orderTime clearfix">
				<li class="comeDate fl clearfix" id="comeDate">
					<span id="comein">入住</span>
					<div>
						<input type="text" id="date_1" readonly class="c1 timeLable pt10" value="请选择" /> 
						<!-- <p class="c1">11月22日</p> -->
						<input type="text" id="alternate1" readonly value="入住时间" class="timeLable c2" style="font-size:0.8rem"> 
						<!-- <p class="c2" id="alternate1"></p> -->
					</div>
				</li>
				<li class="inDays fl ">
					共<span class="daysNumber">0</span>晚
				</li>
				<li class="leaveDate fl clearfix">
					<div>
						<input type="text" id="date_2" readonly class="c1 timeLable pt10" value="请选择"/> 
						<input type="text" id="alternate2" value="离开时间" readonly class="timeLable c2" style="font-size:0.8rem"> 
						<!-- <p class="c1">11月22日</p> -->
						<!-- <p class="c2">周日</p> -->
					</div>
					<span id="leave">离店</span>
				</li>
			</ul>
		</div>	
	</header>
    <div style="padding-bottom:60px;">
        <{section name=l loop=$list}>
    	<div class="baseRoomContainer" data-rid="<{$list[l].id}>">
    			<div class="baseRoom">
    				<ul class=" roomDetail clearfix">
    					<li class="fl roomImgCon">
    						<img src="<{$list[l].pic}>" height="100%" width="100%" alt="">
    					</li>
    					<li class="fl roomInfo">
    						<p ><{$list[l].name}></p>
    						<p class="last"><{$list[l].area}>㎡</p>
    						<p class="last">
                            <{foreach item=v from=$list[l].remark}>
    							<span><{$v}></span>
                            <{/foreach}>
    						</p>
    					</li>
    					<li class="fl roomPrice">
    						<p class="pa pal20">
    							<span style="font-size:0.9rem">￥</span><span class="moneyNum"><{$list[l].lowprice}></span>
    						</p>
    						<i class="pa"></i>
    					</li>
    				</ul>
    			</div>
    	</div>
    	<div class="subRoom">
        <{foreach item=v from=$list[l].project}>
    		<ul class="clearfix">
    			<li class="fl">
    				<p><{$v.name}></p>
    				<p>
    					<span><{$v.name}></span>
    					<span><{$v.isfood}></span>
                        <span><{$v.remark}></span>
    				</p>
    			</li>
    			<li class="fr mt3" data-type="<{$v.id}>" >
    				<span class="c3 preMoney">
    					<b style="font-size:0.8rem">￥</b><{$v.pacific_price}>
    				</span>
                    <{if $v.num>0}>
                        <a>
                            <span class="yy preOrder" <{if $v.pay_type==2}>data-pay="2"<{else}>data-pay="1"<{/if}>>预约</span>
                        </a>
                        <{if $v.pay_type==2}>
                        <p class="prePay">预付</p>
                        <{/if}>
                    <{else}>
                    	<span class="dw">订完</span>
                    <{/if}>
    			</li>
    		</ul>
        <{/foreach}>
    	</div>
        <{/section}>
    	
    	<div class="shade"></div>
    	<div class="roomTypeContaner">
    		<ul class="roomType">
    			<li class="room">
    				<h2 style=>房型</h2>
    				<p class="roomP">
                    <{section name=l loop=$alllist}>
    					<div class="parentD">
                            <span data-tid="<{$alllist[l].id}>" class="spanPublic"><{$alllist[l].name}></span>                                                                           
                        </div>
                    <{/section}>
    				</p>
    			</li>
    			<li class="food">
    				<h2>是否含早餐</h2>
    				<p class="foodP">
    					<div class="parentD">
                            <span data-food="1" class="spanPublic eat1">含早餐</span>
                        </div>
                        <div class="parentD">
    					    <span data-food="2" class="spanPublic eat2">不含餐</span>
                        </div>
    				</p>
    			</li>
    		</ul>
    		<div class="roomBtnCon">
    			<p class="roomBtn">
    				<span id="empty">清空</span>
    				 <a href=""> 
    					<span id="confirm">确定</span>
    				 </a> 
    				
    			</p>
    		</div>
    	</div>
    	<div class="sortRecomendContaner">
    		<ul>
    			<li>
    				<a href="?a=booking&hid=<{$hid}>&order=id">推荐排序</a>
    			</li>
    			<li>
    				<a href="?a=booking&hid=<{$hid}>&order=price">低价优先</a>
    			</li>
    		</ul>
    		
    	</div>
    </div>
	<div class="foot">
        <span class="roomTypeChoose">房型筛选</span>
        <span class="sortRec">推荐排序</span>
        
     </div>  
<script>
window.onload = function() { 
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i) == "micromessenger"){
	document.getElementById("yytitl").style.display="none";
}
}; 
</script>
</body>
</html>